<template>
  <section>
    <a-tabs v-model="activeName" @change="handleClick">
      <a-tab-pane :tab="tab.name" :key="tab.id+''" v-for="tab in dataTypeList">
        <div v-if="tab.type === 'Page'">
          <page-set :title="tab.name" :dataType="activeTab" v-if="activeName === tab.id+''"></page-set>
        </div>
        <div v-if="tab.type === 'Detail'">
          <page-detail :title="tab.name" :dataType="activeTab" v-if="activeName === tab.id+''"></page-detail>
        </div>
        <div v-else>
          <table-list :dataType="activeTab" v-if="activeName === tab.id+''"></table-list>
        </div>
      </a-tab-pane>
    </a-tabs>
  </section>
</template>

<script>
  import { findDataTypeList} from "../../api/pubData";
  import {TableList,PageSet,PageDetail} from "./components";

  export default {
    components:{TableList,PageSet,PageDetail},
    name: "pubData",
    data(){
      return{
        activeName: '100',
        dataTypeList:[]
      }
    },
    computed:{
      activeTab:function () {
        return this.dataTypeList.find(m=>m.id === parseInt(this.activeName))
      }
    },
    methods:{
      handleClick(tab){
        console.log('tab-->',tab)
        this.activeName = tab
      },
      async loadInit(){
        let typeResp = await findDataTypeList();
        console.log('---->',typeResp)
        if(this.qUtil.validResp(typeResp)){
          this.dataTypeList = typeResp.data;
        }
      }
    },
    mounted() {
      this.loadInit();
    }
  }
</script>

<style scoped>

</style>